<template>
  <div>
    <div style="background:#eee;padding:10px 10px">
      <i class="iconfont icon-left" style="margin:0 20px 0 5px" @click="goUpperStory()"></i>
      <span>个人信息</span>
    </div>
    <div>
      <van-cell-group>
        <van-cell size="large" is-link class="avatar">
          <span slot="title">头像</span>
          <van-icon slot="right-icon" name="arrow" />
          <van-uploader style="height:50px;" :after-read="uploadAvatar">
            <img
              slot="default"
              style="height:50px;width:50px;line-height:50px;display:inline-block;border-radius:10px"
              :src="userInfo.avatar"
              alt
            />
          </van-uploader>
        </van-cell>
        <van-cell title="昵称" size="large" is-link :value="userInfo.realName" to="/changeUserName" />
        <van-cell title="收货地址" size="large" is-link value to="/addr" />
        <van-cell title="登录密码修改" size="large" is-link value to="/modifyLoginPsd" />
        <van-cell title="绑定的手机号" size="large" is-link :value="userInfo.phone" />
        <van-cell
          title="实名认证"
          size="large"
          is-link
          :value="userInfo.realName?'已认证':'未认证'"
          :to="userInfo.realName?'':'/verified'"
        />
        <van-cell
          title="支付密码绑定"
          size="large"
          is-link
          :value="buildPayPassword?'已绑定':'未绑定'"
          to="/buildPayPassword"
        />
      </van-cell-group>
    </div>
  </div>
</template>
<script>
// import axios from "axios";
export default {
  data: () => ({
    buildPayPassword: null
  }),
  computed: {
    userInfo() {
      return JSON.parse(this.$store.state.memberInfo);
    }
  },
  mounted() {
    console.log(this.userInfo);
    this.$axios.get(`ym/memberuser/first-login`).then(msg => {
      this.buildPayPassword = msg.data.bindPayPwd;
      //console.log(msg)
    });
  },
  methods: {
    goUpperStory() {
      this.$router.go(-1);
    },
    uploadAvatar(e) {
      let param = new FormData();
      let config = {
        headers: {
          Authorization:
            "bearer" + JSON.parse(this.$store.state.userInfo).access_token,
          "Content-Type": "form-data"
        }
      };
      param.append("files", e.file);
      //console.log(e);
      this.$axios
        .post(`ym/oss-attachment/upload-image`, param, config)
        .then(res => {
          console.log(res);
          if (res.data.code === 0) {
            let data = {
              avatar: res.data.data[0].imgSrc
            };
            this.$axios
              .post(`ym/memberuser/member-modify-avatar`, data)
              .then(res => {
                window.console.log(res);
                if (res.data.code === 0) {
                  let userInfomations = JSON.parse(
                    sessionStorage.getItem("memberInfo")
                  );
                  userInfomations.avatar = data.avatar;
                  sessionStorage.setItem(
                    "memberInfo",
                    JSON.stringify(userInfomations)
                  );
                }
                this.$Toast(res.data.msg);
              });
          }
        });
      // axios
      //   .post(
      //     `http://43.248.122.225/api/ym/oss-attachment/upload-image`,
      //     param,
      //     config
      //   )
      //   .then(msg => {
      //     if (msg.data.code === 0) {
      //       let data = {
      //         avatar: msg.data[0].imgSrc
      //       };
      //       //console.log(1)
      //       this.$axios.post(`ym/memberuser/member-modify-avatar`, data).then(res=>{
      //         window.console.log(res)
      //       })
      //     }
      //   });
    }
  }
};
</script>
<style lang="scss" scoped>
.avatar {
  width: 100%;
  line-height: 50px;
  display: flex;
  align-items: center;
  .van-cell__value {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
}
</style>